import React, { useEffect, useState } from 'react'
import styles from './index.module.less'



interface orderType {
  type: string
  orderData: Array<{ order: { status: string }, items: [] }>
}

export default function OrderTab({ type, orderData }: orderType) {
  console.log(orderData)
  // console.log(type)

  // 页面数据
  const [data, setData] = useState([])

  useEffect(() => {
    switch (type) {
      case '0':
        const aa = [] as Array<object>
        orderData.forEach(item => {
          if (item.order.status + '' === type) {
            aa.push(...item.items)
          }
        })
        console.log(aa)
        break;
      case '1':
        console.log(1)
        break;
      case '2':
        console.log(2)
        break;
      case '3':
        console.log(3)
        break;
      case '4':
        console.log(4)
        break;
    }
  }, [type])

  return (
    <div className={styles.cardBox}>
      <div className={styles.cardTop}>
        <div>订单编号:123123213</div>
        <div>状态</div>
      </div>
      <div className={styles.cardCenter}>
        <div>图片</div>
        <div className={styles.goodsInfo}>
          <div className={styles.goodsName}>
            <div>名称</div>
            <div>单价</div>
          </div>
          <div>
            <div>
              <span>编号</span>
              <span>×1</span>
            </div>
            <div>
              <span>规格:</span>
            </div>
            <div>
              <span>颜色:</span>
              <span>大小:</span>
            </div>
          </div>
        </div>
      </div>
      <div className={styles.cardBottom}>
        <div>时间</div>
        <div>合计</div>
      </div>
    </div>
  )
}
